<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>成都缘友社交网站</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
	<link href="css/bootstrap.min.css" rel="stylesheet">
	<link href="css/common.css" rel="stylesheet">
	<link href="css/self.css" rel="stylesheet">
    <!--[if lt IE 9]>
    <script src="js/html5shiv.js"></script>
    <script src="js/respond.min.js"></script>
    <![endif]-->
</head>
<body>
<header>
	<nav class="navbar head-default" role="navigation">
	  <div class="container">
	    <!-- Brand and toggle get grouped for better mobile display -->
	    <div class="navbar-header">
	      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
	        <span class="sr-only">Toggle navigation</span>
	        <span class="icon-bar"></span>
	        <span class="icon-bar"></span>
	        <span class="icon-bar"></span>
	      </button>
	      <a class="navbar-brand disabled" href="#">成都缘友网</a>
	    </div>

	    <!-- Collect the nav links, forms, and other content for toggling -->
	    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
	      <ul class="nav navbar-nav">
	        <li class="active"><a href="index.html">首页</a></li>
	        <li><a href="friends.html">我的交友</a></li>
	        <li><a href="people.html">附近的人</a></li>
	        <li><a href="photos.html">照片墙</a></li>
	      </ul>
	      <ul class="nav navbar-nav navbar-right">
	          <li><a href="login.html">登录</a></li>
	          <li><a href="sign.html">注册</a></li>
	      </ul>
	    </div><!-- /.navbar-collapse -->
	  </div><!-- /container -->
	</nav><!--导航结束-->
</header>
<main>
	<div class="container">
		<div class="row self-box">
			<div class="col-sm-9 pull-right">
				<form class="form-horizontal" role="form">
				  <div class="form-group clearfix">
				    <label for="image" class="col-sm-3 control-label">头像</label>
				  	<div class="col-sm-8 avator">
					  	<img src="./images/1.jpg" alt="">
				  		<p>保存头像</p>
					  	<input type="file" name="image">
				  	</div>
				  </div>
				  <div class="form-group">
				    <label for="userName" class="col-sm-3 control-label">用户名</label>
				    <div class="col-sm-8">
				      <input name="userName" type="text" class="form-control" id="userName" value="彭和平" readonly>
				    </div>
				  </div>
				  <div class="form-group">
				    <label for="nickName" class="col-sm-3 control-label">昵称</label>
				    <div class="col-sm-8">
				      <input type="text" name="nickName" class="form-control" id="nickName" value="彭和平">
				    </div>
				  </div>
				  <div class="form-group">
				    <label for="sex" class="col-sm-3 control-label">性别</label>
				    <div class="col-sm-8">
				    	<input type="radio"  name="sex" value="female"  checked/>女
				    	<input type="radio"  name="sex" value="female"  />男
				    </div>
				  </div>
				  <div class="form-group">
				    <label for="love" class="col-sm-3 control-label">恋爱情况</label>
				    <div class="col-sm-8">
				    	<input type="radio"  name="love" value="sigle"  checked/>单身
				    	<input type="radio"  name="love" value="loving" />恋爱中
				    </div>
				  </div>
				  <div class="form-group">
				    <label for="job" class="col-sm-3 control-label">工作</label>
				    <div class="col-sm-8 inputPhone">
				      <input type="text" name="job" class="form-control" id="job" value="软件工程师">
				    </div>
				  </div>
				  <div class="form-group">
				    <label for="height" class="col-sm-3 control-label">身高</label>
				    <div class="col-sm-8">
				    	<select name="height" id="height">
					    		<option value="1"  >140</option>
						    	<option value="2"  >150</option>
						    	<option value="3"  >160</option>
						    	<option value="4"  selected  >170</option>
						    	<option value="5"  >180</option>
						    	<option value="6"  >190</option>
						    	<option value="7"  >200</option>
						    	<option value="8"  >210</option>
	                     </select>
				    </div>
				  </div>
				  <div class="form-group">
				    <label for="education" class="col-sm-3 control-label">学历</label>
				    <div class="col-sm-8">
				    	<select name="education" id="education">
					    		<option value="1"  >高中</option>
						    	<option value="2"  >中专</option>
						    	<option value="3"  >大专</option>
						    	<option value="4"  selected  >本科</option>
						    	<option value="5"  >双学士</option>
						    	<option value="6"  >硕士</option>
						    	<option value="7"  >博士</option>
						    	<option value="8"  >博士后</option>
	                     </select>
				    </div>
				  </div>
				  <div class="form-group">
					   <label for="education" class="col-sm-3 control-label">所在区域</label>
					   <div class="col-sm-8">
					   	<select name="education" id="education">
							<option value="1"  selected>青羊区</option>
							<option value="2"  >武侯区</option>
	、	                </select>
					   </div>
				  </div>
				  <div class="form-group">
				   <label for="education" class="col-sm-3 control-label">生日</label>
				   <div class="col-sm-8">
			        <select class="sel_year" rel="2000"></select>年
			        <select class="sel_month" rel="2"></select>月
			        <select class="sel_day" rel="14"></select>日
				    </div>
				  </div>
				  <div class="form-group">
				    <div class="col-sm-offset-3 col-sm-4 col-xs-5">
				      <button type="submit" class="btn">保&nbsp;&nbsp;&nbsp;&nbsp;存</button>
				    </div>
				  </div>
				</form>        
			</div>			
			<div class="col-sm-3 pull-left">
				<p class="self-center">个人中心</p>
				<ul class="list-group self-lists" id="selfList">
					<li class="active" id="nav-self"><a href="self.html">个人资料</a></li>
					<li id="nav-letter"><a href="letter.html">我的私信</a></li>
					<li id="nav-albums"><a href="albums.html">我的相册</a></li>
					<li id="nav-dynamic"><a href="selfDynamic.html">我的动态</a></li>
					<li id="nav-setting"><a href="setting.html">账号设置</a></li>
				</ul>
			</div>
		</div>
	</div>
</main>
<footer>
	<div class="container">
		
    <p class="jy_link">
		<a href="http://jiaoyou.58.com/bj/">北京交友网</a>
        <a href="http://jiaoyou.58.com/sh/">上海交友网</a>
        <a href="http://jiaoyou.58.com/tj/">天津交友网</a>
        <a href="http://jiaoyou.58.com/gz/">广州交友网</a>
        <a href="http://jiaoyou.58.com/zz/">郑州交友网</a>
        <a href="http://jiaoyou.58.com/xa/">西安交友网</a>
        <a href="http://jiaoyou.58.com/sz/">深圳交友网</a>
        <a href="http://jiaoyou.58.com/su/">苏州交友网</a>
        <a href="http://jiaoyou.58.com/cq/">重庆交友网</a>
        <a href="http://jiaoyou.58.com/wh/">武汉交友网</a>
        <a href="http://jiaoyou.58.com/nj/">南京交友网</a>
        <a href="http://jiaoyou.58.com/hz/">杭州交友网</a>
        <a href="http://jiaoyou.58.com/cd/">成都交友网</a>
        <a href="http://jiaoyou.58.com/hrb/">哈尔滨交友网</a>	
        <a href="http://jiaoyou.58.com/cc/">长春交友网</a>
        <a href="http://jiaoyou.58.com/sjz/">石家庄交友网</a>	
        <a href="http://jiaoyou.58.com/jn/">济南交友网</a>
        <a href="http://jiaoyou.58.com/ty/">太原交友网</a>
        <a href="http://jiaoyou.58.com/fz/">福州交友网</a>
        <a href="http://jiaoyou.58.com/nc/">南昌交友网</a>
        <a href="http://jiaoyou.58.com/city/">更多交友网</a>
	</p>
	<p>Copyright (C) 2017 All Rights Reserved. 项目六组 版权所有</p>
	</div>
</footer>
<script src="js/jquery-1.11.1.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/birthday.js"></script>
<script src="js/self.js"></script>
<script>  
$(function () {
	$("#navBar li").removeClass("active");
	$.ms_DatePicker({
            YearSelector: ".sel_year",
            MonthSelector: ".sel_month",
            DaySelector: ".sel_day"
    });
	$.ms_DatePicker();
}); 
</script> 
</body>
</html>